
<template>
    <div class="intention-apply">
        <search-from 
            ref="searchFrom"
            :listUrl="listUrl"
            :listParames="listParames"
            :query="from_query"
            :tabs="from_tabs"
            :tabData="from_tabData"
            :columns="from_tabData.cur=='待审核'?columns_wait:columns_end"
            :loading="loading">
            <!-- 图文 -->
            <template slot-scope="{row}" slot='goodsId' >
                <div class="cell-box cell-box-info">
                    <div class="cell-imgbox imgbox inline"><img class="imgbox-img" :src="row.goodsFirstPic" /></div>
                    <div class="inline cell-count">
                        <p>{{row.goodsName}}</p>
                    </div>
                </div>
            </template>
            <!-- list过滤查找 -->
            <template slot-scope="{row}" slot='optStatusId' >
                <p>{{getNameOrKey(optStatusList,r=>r.value==row.goodsOptStatus) | optStatus}}</p>
            </template>
            <!-- list循环 -->
            <template slot-scope="{row}" slot='specTypesId'>
                <div v-for="item in row.specTypes" class="ivu-table-td">{{item.stSpecName}}</div>
            </template>
            <!-- 左对齐 -->
            <template slot-scope="{row}" slot='auditorId'>
                <div style="text-align:left;">
                    <p>{{row.auditor}}</p>
                    <p>{{row.updateTime}}</p>
                </div>
            </template>
            
            <!-- 放大图 -->
            <template slot-scope="{row}" slot='picId' >
                <div style="padding-top: 10px">
                    <viewer :images="row.smallPics">
                        <img
                        v-for="(src,index) in row.smallPics"
                        :src="src"
                        :key="index"
                        class="pro-img"
                        style="width:50px;height:50px;object-fit: cover;margin:0 8px 8px 0"
                        >
                    </viewer>
                </div>
            </template>

            <!-- 操作 -->
            <template slot-scope="{row}" slot='optionId'>
                <div class="action_table">
                    <a href="javascript:void(0)" class="barTable-btna" style="margin: 10px 5px 0 5px;" @click="click_auditButton(row,1)">审核</a>
                    <Poptip title="你确定要删除吗" confirm transfer style="text-align:left;" @on-ok="click_deleteButton(row)" v-if="isDeleteButton">
                        <a href="javascript:void(0)" class="barTable-btna" style="margin: 10px 5px 0 5px;" >删除</a>
                    </Poptip>
                </div>
            </template>
        </search-from>

        <!-- 复制文本 -->
        <div ref="clipboard" v-clipboard="{
            value: clipboardVal,
            success:()=>$tipsMessage('复制成功',1)
        }" style="display:none;"></div>
    </div>
</template>
<script>
import { mapState, mapActions, mapMutations } from 'vuex'
import SearchFrom from '_c/search-from';
import { getPermissionId, getNameOrKey } from '_libs/util';

export default {
    name: 'GoodsAuditList',
    components: { SearchFrom },
    data(){
        const optStatusList = []
        return {
            loading: false,
            listUrl: 'goodsAuditList',
            listParames: {
                approveStatus: '1'
            },
            optStatusList: optStatusList, //商家操作
            from_tabs: ['待审核','已审核'],
            from_tabData: {cur: '待审核', render: this.click_tabs},
            reportStatusList: {},

            from_query: [
                { type: "input", label: "商品名称", tips: "输入商品名称", key: "goodsName", value: "" },
                { type: "select", label: "供应商名称", key: "supplierId", selectList: [], "item-value": "id", "item-label": "supBrandname" },
                { type: "select", label: "属性类目", key: "categoryId", selectList: [], "item-value": "data", "item-label": "value" },
                { type: "input", label: "商品编号", tips: "输入商品编号", key: "goodsNo", value: "" },
                { type: "select", label: "品牌名称", key: "brandId", selectList: [], "item-value": "id", "item-label": "brandName" },
                { type: "select", label: "商家操作", key: "goodsOptStatus", selectList: optStatusList, tips: "全部"},
            ],
            columns_wait:[
                {key: 'goodsId', title: '商品', align:'center', slot:'goodsId', minWidth:160},
                {key: 'supBrandName', title: '供应商', align:'center'},
                {key: 'goodsBrandName', title: '品牌', align:'center'},
                {key: 'goodsNo', title: '商品编号', align:'center'},
                {key: 'goodsVipPriceInteval', title: '成交价', align:'center'},
                {key: 'goodsCostPriceInteval', title: '供货价', align:'center'},
                {key: 'goodsSku', title: '库存', align:'center'},
                {key: 'goodsOptStatus', title: '商家操作', align:'center', slot:'optStatusId', width:90},
                {key: 'updateTime', title: '申请时间', align:'center', width:140},
            ],
            columns_end:[
                {key: 'goodsId', title: '商品', align:'center', slot:'goodsId', minWidth:140},
                {key: 'supBrandName', title: '供应商', align:'center'},
                {key: 'goodsBrandName', title: '品牌', align:'center'},
                {key: 'goodsNo', title: '商品编号', align:'center'},
                {key: 'goodsVipPriceInteval', title: '成交价', align:'center'},
                {key: 'goodsCostPriceInteval', title: '供货价', align:'center'},
                {key: 'goodsSku', title: '库存', align:'center'},
                {key: 'goodsOptStatus', title: '商家操作', align:'center', slot:'optStatusId'},
                {key: 'goodsReportStatus', title: '审核结果', align:'center',slot: 'reportStatusId'},
                {key: 'goodsReportReason', title: '审核说明', align:'center', slot:'reportReasonId'},
                // {key: 'updateTime', title: '审核时间', align:'center', width:138},
                {key: 'auditor', title: '审核人', align:'center',slot:'auditorId', width:138},
                {title: '操作', align:'center', slot:'optionEndId', width:90}
            ]
        }
    },
    filters:{
        optStatus(content) {
            let res = '';
            if(content && content.length){
                if(content[0]) res = content[0].label;
            };
            return res;
        },
    },
    computed:{
        ...mapState({
            isAuditButton: state => getPermissionId(state.app.PermissionList,'GoodsAuditList-Audit'),
            isEditButton: state => getPermissionId(state.app.PermissionList,'GoodsSpecsList-Edit'),
            isAddButton: state => getPermissionId(state.app.PermissionList,'GoodsSpecsList-Add'),
            categoryList: state => state.user.addGoodsCategoryList,
        }),
        // ...mapState('user', ['categoryList'])
    },
    created(){
        this.handleGoodsCategoryList();
        this.handleGoodsSupplierList();
        this.handleGoodsBrandList();
        this.bus.$on('refresh', (data) => {
            if(data==="GoodsAuditListDetail"){
                console.log('刷新');
                return this.GetList()
            };
        })
    },
    methods: {
        getNameOrKey,
        ...mapMutations([
            'closeNoTag'
        ]),
        ...mapActions([
            'handleGoodsCategoryList',
            'handleGoodsSupplierList',
            'handleGoodsBrandList'
        ]),
        GetList(){
            return this.$refs.searchFrom.GetList();
        },
        click_tabs(name){
            if(name==='待审核'){
                this.listParames.approveStatus = '1';
            }else{
                this.listParames.approveStatus = '2';
            };
            this.$nextTick(this.GetList);
        },
        //跳转
        click_auditButton(row,state){
            this.$go({
                name:"GoodsAuditListDetail",replace:false,
                params:{id: row.id || row.goodsId},
                query: { state: state}
            }, this.$router,1);
        },
        //导出
        click_Export(){
            let searchForm = this.$refs.searchFrom.searchForm;
            let startTime = searchForm.startDate;
            let endTime = searchForm.endDate;
            let msg = "";
            if(!(searchForm.userId) && !(startTime && endTime)) msg = "时间必填";
            else if(startTime && endTime) {
                let diffTime = new Date(endTime) - new Date(startTime)
                let maxDay = 86400000 * 30;
                if(diffTime>maxDay) msg = "时间不能大于一个月";
            };
            if(msg) {
                this.$Message.warning(msg);
                return false;
            };
            exportExcel(this,'pointsLogExecl',searchForm);
        },
        //对话框
        click_delGoods(row){
            let _this = this;
            this.$Modal.confirm({
                title: '提示',
                content: "确认要删除么？",
                loading: true,
                async onOk(){
                    let res = await _this.$post('morePurchaseLevelGoodsDel',{levelId: row.id});
                    // let res = await this.$post(url,params,{ fileData }); //文件上传 {key: [file]}
                    this.buttonLoading = false;
                    if(res) {
                        _this.$Modal.remove();
                        _this.$tipsMessage('删除成功',1)
                        _this.GetList();
                    }
                }
            });
        },
        //复制文本
        click_copylink(row){
            this.clipboardVal = row.goodsName;
            this.$nextTick(()=>{
                this.$refs.clipboard.click();
            });
        },
        //内置方法
        _getSelectIds(){
            let ids = '';
            let msg = "";
            if(!this.selectList.length) msg = "请选择商品";
            if(msg) {
                this.$tipsMessage(msg);
                return ids;
            };
            ids = this.selectList.map((el,ix) => {
                return el.goodsId; //id
            }).join(',')
            return ids;
        },
        _tips(title,url,reqdata){
            return new Promise((resolve, reject) => {
                let _this = this;
                this.$Modal.confirm({
                    title: title,
                    loading: true,
                    content: '确认要操作吗',
                    async onOk(){
                        let res = await _this.$post(url,reqdata);
                        this.buttonLoading = false;
                        if(res) {
                            _this.$Modal.remove();
                            _this.GetList();
                            resolve();
                        }
                    }
                });
            });
        }
    },
    watch:{
        //表格内容
        isAuditButton: {
            handler(newVal, oldVal) {
                if(newVal) this.columns_wait.push({title: '操作', align:'center', slot:'optionId', width:80});
            },
            immediate: true,
        },
        //操作区
        isButton_Export: {
            handler(newVal, oldVal) {
                let list = this.from_options;
                if(list && list.length) list[0].show = newVal;
            },
            immediate: true,
        },
        //筛选区
        categoryList: {
            handler(newVal, oldVal) {
                if(newVal && newVal.length){
                    let list = this.from_query;
                    if(list && list.length) list[2].selectList = newVal;
                }
            },
            immediate: true,
        },
    }
}
</script>

